import { Button, Switch, Tooltip } from 'antd';
import MyIcon from '@/components/MyIcon';
import pageStyles from '@/common/pageLayout.less';
import { positionAPI } from '../../type';
import { EyeOutlined, EditOutlined, PartitionOutlined, ProjectOutlined } from '@ant-design/icons';
import { Fragment } from 'react';
import { tooltipLength } from '@/utils';

const Operation = (permissions: Record<string, any>, clickFnc: positionAPI.IOnPosOptClick, record?: Record<string, any>) => {
  let operationArray: any = [];

  const Edit: any = record && record?.id && record?.isOpen == 1 && permissions['/positionController/edit'] && (
    <Fragment key={record?.id + 'posEdit'}>
      <Button
        className="manageBtntTxtStyle"
        onClick={() => {
          clickFnc?.onPosOption(record, 'edit');
        }}
        type={'link'}
        size={'small'}
        icon={<EditOutlined />}
      >
        编辑
      </Button>
    </Fragment>
  );

  const View: any = record?.id && record && record?.id && permissions['/positionController/getPositionByID/{id}'] && (
    <Fragment key={record?.id + 'posSee'}>
      <Button
        className="manageBtntTxtStyle"
        onClick={() => {
          clickFnc?.onPosView(record);
        }}
        type={'link'}
        size={'small'}
        icon={<EyeOutlined />}
      >
        查看
      </Button>
    </Fragment>
  );

  // const role: any = record?.id &&
  //   record?.isOpen == 1 &&
  //   // permissions['/positionController/grant'] && (
  //   permissions['/userController/grant'] && (
  //     <Fragment key={record?.id + 'posGrant'}>
  //       <Tooltip title="为岗位设置角色资源权限">
  //         <Button
  //           className='manageBtntTxtStyle'
  //           onClick={() => {
  //             clickFnc?.onPosOption(record, 'grant');
  //           }}
  //           type={'link'}
  //           size={'small'}
  //           icon={<GoldOutlined />}
  //         >
  //           授权
  //         </Button>
  //       </Tooltip>
  //     </Fragment>
  //   );

  const powers: any = record?.id && record?.isOpen == 1 && permissions['/positionController/setDutyScope'] && (
    <Fragment key={record?.id + 'posDuty'}>
      <Tooltip title="为岗位设置职权范围">
        <Button
          className="manageBtntTxtStyle"
          onClick={() => {
            clickFnc?.onPosOption(record, 'setDutyScope');
          }}
          type={'link'}
          size={'small'}
          icon={<PartitionOutlined />}
        >
          管辖
        </Button>
      </Tooltip>
    </Fragment>
  );

  const subject: any = record?.id && record?.isOpen == 1 && permissions['/positionController/setSubject'] && (
    <Fragment key={record?.id + 'posSubj'}>
      <Tooltip title="为岗位设置管辖业务范围">
        <Button
          className="manageBtntTxtStyle"
          onClick={() => {
            clickFnc?.onPosOption(record, 'setSubject');
          }}
          type={'link'}
          size={'small'}
          icon={<ProjectOutlined />}
        >
          科目
        </Button>
      </Tooltip>
    </Fragment>
  );

  // operationArray = [View, Edit, role, powers, subject];
  operationArray = [View, Edit, powers, subject];
  return operationArray;
};

const getPosColumns: any = (permissions: Record<string, any>, clickFnc: positionAPI.IOnPosOptClick) => {
  return [
    {
      title: '岗位名称',
      dataIndex: 'name',
      key: 'name',
      width: 220,
      fixed: 'left',
      ellipsis: {
        showTitle: true,
      },
      visible: true,
      unDrag: true,
      render: (text: string, record: Record<string, any>) => {
        // return <Fragment>{text}</Fragment>;
        return (
          <Tooltip title={text} placement="top">
            <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: '100%' }} id={record?.id}>
              <MyIcon type={'icon-icon_lingdaopishi'} />
              &nbsp;
              {text ?? '--'}
            </span>
          </Tooltip>
        );
      },
    },
    {
      title: '岗位描述',
      dataIndex: 'description',
      key: 'description',
      width: 200,
      visible: true,
      render: (text: string) => {
        return (
          <Tooltip title={text}>
            <div
              className={pageStyles['over-flow-hidden']}
              style={{
                maxWidth: 180,
              }}
            >
              {text ?? '--'}
            </div>
          </Tooltip>
        );
      },
    },
    {
      title: '职权范围',
      dataIndex: 'dutyScopeName',
      key: 'dutyScopeName',
      width: 200,
      visible: true,
      render: (text: string) => {
        return (
          <Tooltip title={text ? tooltipLength(text, 150) : ''}>
            <div className={pageStyles['over-flow-hidden']} style={{ maxWidth: 180 }}>
              {text ?? '--'}
            </div>
          </Tooltip>
        );
      },
    },
    {
      title: '排序',
      dataIndex: 'seq',
      key: 'seq',
      width: 90,
      visible: true,
      sorter: (a: any, b: any) => {
        if (a.seq < b.seq) {
          return -1;
        } else {
          return 1;
        }
      },
      render: (text: string) => {
        return (
          <Tooltip title={text}>
            <div className={pageStyles['over-flow-hidden']} style={{ maxWidth: 80 }}>
              {text ?? '--'}
            </div>
          </Tooltip>
        );
      },
    },
    {
      title: '状态',
      dataIndex: 'isOpen',
      key: 'isOpen',
      width: 110,
      visible: true,
      sorter: (a: any, b: any) => {
        if (a.isOpen < b.isOpen) {
          return -1;
        } else {
          return 1;
        }
      },
      render: (text: string, record: Record<string, any>) => {
        return (
          <>
            <Switch
              checkedChildren="启用"
              unCheckedChildren="禁用"
              checked={text == '1' ? true : false}
              onChange={(checked: boolean) => {
                clickFnc?.onChangeIsOpen(checked, record);
              }}
              disabled={permissions['/positionController/modifyState'] ? false : true}
            />
          </>
        );
      },
    },
    {
      title: '备注',
      dataIndex: 'remark',
      key: 'remark',
      width: 200,
      visible: false,
      render: (text: string) => {
        return (
          <Tooltip title={text}>
            <div className={pageStyles['over-flow-hidden']} style={{ maxWidth: 180 }}>
              {text ?? '--'}
            </div>
          </Tooltip>
        );
      },
    },
    {
      title: '操作',
      dataIndex: 'option',
      width: 280,
      key: 'option',
      fixed: 'right',
      visible: true,
      unDrag: true,
      render: (_text: string, record: Record<string, any>) => {
        return (
          <div
            style={{
              display: 'flex',
            }}
          >
            {Operation(permissions, clickFnc, record)}
          </div>
        );
      },
    },
  ];
};
export { getPosColumns };
